﻿html, body { height: 100%; -webkit-tap-highlight-color: transparent; }
html{font-size: 110%;}
@media screen and (max-device-width:414px) 
{
    html{font-size: 120%;}
    
}
@media screen and (max-device-width:375px) 
{
    html{font-size: 110%;}
    
}
@media screen and (max-device-width:320px) 
{
    html{font-size: 100.5%;}
    
}
body { margin: 0; font-family: Arial,Verdana; background-color: #fff; }
#screen { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;position: relative;}
/*全屏*/
#screen{position: absolute;top: 0;left: 0;width: 100%;}
/*居中*/
.p1_kv,.p2_kv,.p3_kv,.p4_kv,.p5_kv,.p6_kv,.p7_kv{position: absolute;top: 50%;left: 0;
  -webkit-transform:translateY(-50%);}
@media only screen and (min-width: 1000px) { #screen { position: relative; width: 480px; margin: 0 auto; } }
img{display: block;width: 100%}
#logo{position: absolute;width: 100%;z-index: 101;top: 0;left: 0}
@-webkit-keyframes arrowup{
  0%    {opacity: 0;-webkit-transform:translate3d(0,30%,0);}
  70%   {opacity: 1;-webkit-transform:translate3d(0,0,0);}
  100%  {opacity: 0;-webkit-transform:translate3d(0,-30%,0);}
}
@-webkit-keyframes fadein{
  0%    {opacity: 0;}
  100%  {opacity: 1;}
}
.page1,.page2,.page3,.page4,.page5,.page6,.page7,.page8,.page9,.page55{position: absolute;top: 0;
  left: 0;bottom: 0;right: 0;overflow: hidden;}
#arrowup{position: absolute;bottom: 4%;left: 45%;width: 10%;z-index: 200;
  -webkit-animation:arrowup 2s 1s infinite ease forwards;}
#page_box{position: relative;overflow: hidden;-webkit-box-flex:1;}
#share{position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;display: none;
  z-index: 9999999}

.checkothers{position: absolute;top: 70%;left: 16%;width: 33%;height: 6%;}
.share{position: absolute;top: 70%;left: 55%;width: 34%;height: 6%;}
.buy{position: absolute;top: 80%;left: 27%;width: 50%;height: 5%;}
.img{position: absolute;top: 20.6%;left: 8%;width: 84%}
.sharebox{position: absolute;top: 0;left: 0;width: 100%;display: none}
.p4_a{position: absolute;top: 10%;left: 11%;width: 16%;height: 5%;}
.p4_b{position: absolute;top: 78%;left: 26%;width: 48%;height: 9%;}
.block{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;background-color: rgba(0,0,0,0.8);
  display: none;}
  .block img{position: absolute;top: 20%;left: 5%;width: 90%}

li{list-style: none;}

.box{position: absolute;top: 14%;left: 4%;width: 92%;height: 63%;overflow: hidden;margin: 0;padding: 0}
.p4_box{position: relative;float: left;width: 30%;margin: 2% 1.5%}
.p4_pic{position: absolute;top: 5%;left: 5%;width: 90%}
.p4_zan{position: absolute;top: 85%;left: 10%;font-size: 0.7rem;color:#beb69c}
.p4_zanbtn{position: absolute;top: 85%;right: 10%;width: 30%}


  body,ul,li {
  padding:0;
  margin:0;
  border:0;
}

body {
  font-size:12px;
  -webkit-user-select:none;
    -webkit-text-size-adjust:none;
  font-family:helvetica;
}

#header {
  position:absolute; z-index:2;
  top:0; left:0;
  width:100%;
  height:45px;
  line-height:45px;
  background-color:#d51875;
  background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #fe96c9), color-stop(0.05, #d51875), color-stop(1, #7b0a2e));
  background-image:-moz-linear-gradient(top, #fe96c9, #d51875 5%, #7b0a2e);
  background-image:-o-linear-gradient(top, #fe96c9, #d51875 5%, #7b0a2e);
  padding:0;
  color:#eee;
  font-size:20px;
  text-align:center;
}

#header a {
  color:#f3f3f3;
  text-decoration:none;
  font-weight:bold;
  text-shadow:0 -1px 0 rgba(0,0,0,0.5);
}

#footer {
  position:absolute; z-index:2;
  bottom:0; left:0;
  width:100%;
  height:48px;
  background-color:#222;
  background-image:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #999), color-stop(0.02, #666), color-stop(1, #222));
  background-image:-moz-linear-gradient(top, #999, #666 2%, #222);
  background-image:-o-linear-gradient(top, #999, #666 2%, #222);
  padding:0;
}

#wrapper {
  position:absolute; z-index:1;
  top:0; bottom:0; left:0;
  width:100%;
  overflow:auto;
}

#scroller {
  position:absolute; z-index:1;
/*  -webkit-touch-callout:none;*/
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  width:100%;
  padding:0;
}

#scroller ul {
  list-style:none;
  padding:0;
  margin:0;
  width:100%;
  text-align:left;
  overflow: hidden;
}

/*#scroller li {
  padding:0 10px;
  height:40px;
  line-height:40px;
  border-bottom:1px solid #ccc;
  border-top:1px solid #fff;
  background-color:#fafafa;
  font-size:14px;
}*/

#myFrame {
  position:absolute;
  top:0; left:0;
}



/**
 *
 * Pull down styles
 *
 */
#pullDown, #pullUp {
  height:40px;
  line-height:40px;
  padding:5px 10px;
  font-weight:bold;
  font-size:14px;
  color:#888;
}
#pullDown .pullDownIcon, #pullUp .pullUpIcon  {
  display:block; float:left;
  width:40px; height:40px;
  background:url(pull-icon@2x.png) 0 0 no-repeat;
  -webkit-background-size:40px 80px; background-size:40px 80px;
  -webkit-transition-property:-webkit-transform;
  -webkit-transition-duration:250ms;  
}
#pullDown .pullDownIcon {
  -webkit-transform:rotate(0deg) translateZ(0);
}
#pullUp .pullUpIcon  {
  -webkit-transform:rotate(-180deg) translateZ(0);
}

#pullDown.flip .pullDownIcon {
  -webkit-transform:rotate(-180deg) translateZ(0);
}

#pullUp.flip .pullUpIcon {
  -webkit-transform:rotate(0deg) translateZ(0);
}

#pullDown.loading .pullDownIcon, #pullUp.loading .pullUpIcon {
  background-position:0 100%;
  -webkit-transform:rotate(0deg) translateZ(0);
  -webkit-transition-duration:0ms;

  -webkit-animation-name:loading;
  -webkit-animation-duration:2s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:linear;
}

@-webkit-keyframes loading {
  from { -webkit-transform:rotate(0deg) translateZ(0); }
  to { -webkit-transform:rotate(360deg) translateZ(0); }
}
